<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>Input Element Test</title>
</head>
<body title="Input Element Test Body">


<br><br>

<h2> Anchors </h2>
<a id="anchorA_id" name="anchorA_name" title="anchorA_title" href="/">Href with Id, name, and title.</a><br/>
<a id="anchorB_id" href="/">Href with Id.</a><br/>
<a id="anchorC_id" name="anchorC_name" href="/">Href with Id and name.</a><br/>
<a name="anchorD_name" href="/">Href with name.</a><br/>
<a name="anchorE_title" href="/">Href with title.</a><br/>


<!-- @todo Area element -->

<h2> Buttons </h2>
<label for="buttonA_id">A button with a label.
    <button id="buttonA_id" type="button" value="ButtonA">Button A</button>
</label><br/><br/>

<label for="buttonB_id">A disabled button with a label.
    <button id="buttonB_id" type="button" value="ButtonB" title="title" disabled> Button B, Disabled</button>
</label><br/><br/>

<button id="buttonC_id" type="button" value="NoLabelButtonC"> Button C, No label</button>
<br/><br/>


<h2> Input Elements </h2>

<h3> Input: Text </h3>
<label for="textA_id"> Input Text with id, name, value, size and maxLength </label><br>
<input type="text" id="textA_id" name="textA_name" value="textA_value" size="50" maxlength="100"/>
<br><br>

<label for="textB_id"> Input Text with id, name, value, size </label><br>
<input type="text" id="textB_id" name="textB_name" value="textB_value" size="51"/>
<br><br>

<label for="textC_id"> Input Text with id, name, value</label><br>
<input type="text" id="textC_id" name="textC_name" value="textC_value"/>
<br><br>

<label for="textD_id"> Input Text with id, name</label><br>
<input type="text" id="textD_id" name="textD_name"/>
<br><br>

<label for="textC_id"> Input Text with id, name, and Char value</label><br>
<input type="text" id="textE_id" name="textE_name" value="x"/>
<br><br>

<label for="textC_id"> Input Text with id, name, and double value</label><br>
<input type="text" id="textF_id" name="textF_name" value="2.71828182845904523536"/>
<br><br>

<label for="textC_id"> Input Text with id, name and Integer value</label><br>
<input type="text" id="textG_id" name="textG_name" value="42"/>
<br><br>

<label for="textC_id"> Input Text with id, name and boolean True</label><br>
<input type="text" id="textH_id" name="textH_name" value="true"/>
<br><br>

<label for="textC_id"> Input Text with id, name and boolean false</label><br>
<input type="text" id="textI_id" name="textI_name" value="false"/>
<br><br>

<label for="textC_id"> Input Text with id, name and empty value</label><br>
<input type="text" id="textJ_id" name="textJ_name" value=""/>
<br><br>
<br><br>

<h3> Input: Checkbox </h3>

<INPUT type=checkbox id="checkboxA_id" name="checkboxA_name">Checklist item with id, name<br/><br/>
<INPUT type=checkbox id="checkboxB_id" name="checkboxB_name" checked>Checklist item with id, name, checked<br/><br/>

<h3> Input: Radio </h3>

<INPUT type=radio id="radioA_id" name="radioA_name" value="radioA_value">Radio item with id, unique name,
value<br/><br/>
<INPUT type=radio id="radioB_id" name="radioB_name" value="radioB_value" checked>Radio item with id, unique name,
checked<br/><br/>

<h4> Radio Group </h4>
<INPUT type=radio id="radioGroupA_id" name="radioGroup_name" value="radioGroupA_value">Radio item with id, unique name,
in RadioGroupA<br/><br/>
<INPUT type=radio id="radioGroupB_id" name="radioGroup_name" value="radioGroupB_value">Radio item with id, unique name,
in RadioGroupA<br/><br/>
<INPUT type=radio id="radioGroupC_id" name="radioGroup_name" value="radioGroupC_value" checked>Radio item with id,
unique name, checked, in RadioGroupA<br/><br/>
<INPUT type=radio id="radioGroupD_id" name="radioGroup_name" value="radioGroupD_value">Radio item with id, unique name,
in RadioGroupA<br/><br/>
<INPUT type=radio id="radioGroupE_id" name="radioGroup_name" value="radioGroupE_value">Radio item with id, unique name,
in RadioGroupA<br/><br/>

<h3> Input: Password </h3>
<label for="passwordA_id"/> <input type=password id="passwordA_id" name="passwordA_name">

<h3> Input: Hidden </h3>

<h3> Input: Submit </h3>

<h3> Input: Reset </h3>

<h3> Input: Button </h3>

<h3> Input: File </h3>

<h3> Input: Image </h3>

<h2> Paragraph </h2>

<p>A paragraph element </p>

<p>
    A much larger paragraph element.
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum rutrum elit sit amet nibh. Pellentesque
    pellentesque luctus felis. Sed eros felis, luctus sit amet, faucibus id, sodales a, enim. Quisque turpis neque,
    pharetra sagittis, fringilla vel, lobortis in, nisl. Suspendisse eros nulla, scelerisque quis, molestie in, dictum
    at, enim. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Ut nonummy.
    Phasellus ante. Maecenas quam. Proin vehicula, nulla eu vehicula cursus, arcu purus convallis dolor, nec iaculis
    felis nulla a augue. Maecenas quam felis, eleifend id, tempus eget, ornare ac, elit.
</p>


<h2> Select </h2>

<h3> Single-Select</h3>
<label for="selectA_id">Select list with id, name, single select</label>
<select id="selectA_id" name="selectA_name">
    <option id="selectA_optA_id" value="selectA_optA">selectA_optA</option>
    <option id="selectA_optB_id" value="selectA_optB">selectA_optB</option>
    <option id="selectA_optC_id" value="selectA_optC">selectA_optC</option>
    <option id="selectA_optD_id" value="selectA_optD">selectA_optD</option>
    <option id="selectA_optE_id" value="selectA_optE">selectA_optE</option>
    <option id="selectA_optF_id" value="selectA_optF">selectA_optF</option>
</select>

<h3> Multi-Select</h3>
<div><label for="selectB_id" style="vertical-align:top;">Select list with id, name, multiple select</label>
    <select id="selectB_id" name="selectB_name" multiple>
        <option id="selectB_optA_id" value="selectB_optA">selectB_optA</option>
        <option id="selectB_optB_id" value="selectB_optB">selectB_optB</option>
        <option id="selectB_optC_id" value="selectB_optC">selectB_optC</option>
        <option id="selectB_optD_id" value="selectB_optD">selectB_optD</option>
        <option id="selectB_optE_id" value="selectB_optE">selectB_optE</option>
        <option id="selectB_optF_id" value="selectB_optF">selectB_optF</option>
    </select>
</div>


<h2>Text area</h2>
<label for="textAreaA_id">Single line text area</label>
<textarea id="textAreaA_id" rows="1" cols="50"> </textarea><br/><br/>

<label for="textAreaB_id">10 line text area</label>
<textarea id="textAreaB_id" rows="10" cols="50"> </textarea><br/><br/>

<label for="textAreaC_id">10 line text area, readonly</label>
<textarea id="textAreaC_id" rows="10" cols="50" readonly>
    Some text
    For
    our text area
</textarea><br/><br/>

<label for="textAreaD_id">10 line text area, disabled </label>
<textarea id="textAreaD_id" rows="1" cols="50" disabled>
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vestibulum rutrum elit sit amet nibh. Pellentesque
    pellentesque luctus felis. Sed eros felis, luctus sit amet, faucibus id, sodales a, enim. Quisque turpis neque,
    pharetra sagittis, fringilla vel, lobortis in, nisl. Suspendisse eros nulla, scelerisque quis, molestie in, dictum
    at, enim. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Ut nonummy.
    Phasellus ante. Maecenas quam. Proin vehicula, nulla eu vehicula cursus, arcu purus convallis dolor, nec iaculis
    felis nulla a augue. Maecenas quam felis, eleifend id, tempus eget, ornare ac, elit.
</textarea><br/><br/>

</body>
</html>